﻿<#include "include/_meta.html">
<title>管理员列表</title>
<style type="text/css">
    .className {
        line-height: 40px;
        height: 40px;
        width: 98px;
        color: #ffffff;
        background-color: #ededed;
        font-size: 16px;
        font-weight: bold;
        font-family: SimSun;
        background: -webkit-gradient(linear, left top, left bottom, color-start(0.05, #768d87), color-stop(1, #6c7c7c));
        background: -moz-linear-gradient(top, #768d87 5%, #6c7c7c 100%);
        background: -o-linear-gradient(top, #768d87 5%, #6c7c7c 100%);
        background: -ms-linear-gradient(top, #768d87 5%, #6c7c7c 100%);
        background: linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
        background: -webkit-linear-gradient(top, #768d87 5%, #6c7c7c 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#768d87', endColorstr='#6c7c7c', GradientType=0);
        border: 1px solid #566963;
        -webkit-border-top-left-radius: 6px;
        -moz-border-radius-topleft: 6px;
        border-top-left-radius: 6px;
        -webkit-border-top-right-radius: 6px;
        -moz-border-radius-topright: 6px;
        border-top-right-radius: 6px;
        -webkit-border-bottom-left-radius: 6px;
        -moz-border-radius-bottomleft: 6px;
        border-bottom-left-radius: 6px;
        -webkit-border-bottom-right-radius: 6px;
        -moz-border-radius-bottomright: 6px;
        border-bottom-right-radius: 6px;
        -moz-box-shadow: inset 0px 1px 3px 0px #91b8b3;
        -webkit-box-shadow: inset 0px 1px 3px 0px #91b8b3;
        box-shadow: inset 0px 1px 3px 0px #91b8b3;
        text-align: center;
        display: inline-block;
        text-decoration: none;
    }

    .className:hover {
        background-color: #f5f5f5;
        background: -webkit-gradient(linear, left top, left bottom, color-start(0.05, #6c7c7c), color-stop(1, #768d87));
        background: -moz-linear-gradient(top, #6c7c7c 5%, #768d87 100%);
        background: -o-linear-gradient(top, #6c7c7c 5%, #768d87 100%);
        background: -ms-linear-gradient(top, #6c7c7c 5%, #768d87 100%);
        background: linear-gradient(to bottom, #6c7c7c 5%, #768d87 100%);
        background: -webkit-linear-gradient(top, #6c7c7c 5%, #768d87 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6c7c7c', endColorstr='#768d87', GradientType=0);
    }
</style>
</head>

<article class="page-container">

    <div id="welcome">
        <input type="radio" name="custumerType" id="individual" value="individual" data-waschecked="">个人用户
        <input type="radio" name="custumerType" id="enterprise" value="enterprise" data-waschecked="">企业用户
        <div class="row cl" style="margin-left:700px;">
            <a id="goRegister" class='className' href="javascript:;">去登记</a>
        </div>
    </div>
    <form class="form form-horizontal" id="individual-check">
        <div id="individual-part" style="display: none">
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>客户手机:</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="客户手机" id="custormerPhone"
                           name="custormerPhone">
                </div>
            </div>


            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>客户姓名:</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" autocomplete="off" value="" placeholder="客户姓名"
                           id="custormerName"
                           name="custormerName">
                </div>
            </div>

            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>身份证号:</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" autocomplete="off" value="" placeholder="身份证号"
                           id="custormerIdCard"
                           name="custormerIdCard">
                </div>
            </div>

            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>驾驶证号：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" autocomplete="off" value="" placeholder="驾驶证号"
                           id="custormerDriveCard"
                           name="custormerDriveCard"></div>
                <a id="individualNextStep" class='className' href="javascript:;">下一步</a>
            </div>

        </div>
    </form>
    <form class="form form-horizontal" id="enterprise-check">
        <div id="enterprise-part" style="display: none">
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>代办人手机:</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="客户手机" id="custormerPhone"
                           name="custormerPhone">
                </div>
            </div>


            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>代办人姓名:</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" autocomplete="off" value="" placeholder="客户姓名"
                           id="custormerName"
                           name="custormerName">
                </div>
            </div>

            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>代办人身份证号:</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" autocomplete="off" value="" placeholder="身份证号"
                           id="custormerIdCard"
                           name="custormerIdCard">
                </div>
            </div>

            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>代办人驾驶证号：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" autocomplete="off" value="" placeholder="驾驶证号"
                           id="custormerDriveCard"
                           name="custormerDriveCard"></div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>上传营业执照：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <div class="uploader-thum-container" id="fileQueued">
                        <div id="filePicker">选择图片</div>
                        <div id="fileList" class="uploader-list"></div>
                    </div>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>营业执照:</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="" id="custormerCompanyImage"
                           name="custormerCompanyImage">
                </div>
            </div>


            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>企业编号：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="" id="custormerCompanyId"
                           name="custormerCompanyId">
                </div>
            </div>

            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>机构代码：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="机构代码" name="custormerCompanyCode"
                           id="custormerCompanyCode">
                </div>
            </div>

            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>税务证号：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" value="" placeholder="税务证号" name="custormerCompanyTaxIIdCard"
                           id="custormerCompanyTaxIIdCard">
                    <a id="enterpriseNextStep" class='className' href="javascript:;">下一步</a>

                </div>
            </div>
        </div>
    </form>
</article>
<#include "include/_footer.html">
<script type="text/javascript" src="lib/webuploader/0.1.5/webuploader.js"></script>
<script type="text/javascript">
    $(function () {
        $('#goRegister').on('click', function () {
            if ($('#enterprise').prop("checked")) {
                $('#welcome').css('display', 'none')
                $('#enterprise-part').css('display', 'block')
                var uploader = WebUploader.create({
                    auto: false,
                    swf: 'lib/webuploader/0.1.5/Uploader.swf',
                    server: '/uploadFile',
                    pick: '#filePicker',
                    fileVal: 'uploadfile',
                    fileNumLimit: 1,
                    resize: false,
                    accept: {
                        title: 'Images',
                        extensions: 'gif,jpg,jpeg,bmp,png',
                        mimeTypes: 'image/*'

                    }

                });
                uploader.on('fileQueued', function (file) {
                    var $li = $(
                        '<div id="' + file.id + '" class="file-item thumbnail">' +
                        '<img>' +
                        '<div class="info">' + file.name + '</div>' +
                        '</div>'
                        ),
                        $img = $li.find('img');

                    // $list为容器jQuery实例
                    $('#fileList').append($li);
                    $('#custormerCompanyImage').val(file.name)
                    // 创建缩略图
                    // 如果为非图片文件，可以不用调用此方法。
                    // thumbnailWidth x thumbnailHeight 为 100 x 100
                    uploader.makeThumb(file, function (error, src) {
                        if (error) {
                            $img.replaceWith('<span>不能预览</span>');
                            return;
                        }

                        $img.attr('src', src);
                    }, 150, 150);
                    $li.on('click', '.info', function () {
                        uploader.removeFile(uploader.getFile(file.id, true))
                        $(this).parent().remove();
                        $('#custormerCompanyImage').val('');
                    })
                    $('#enterpriseNextStep').on('click', function () {
                        uploader.upload()
                        console.log($('#custormerCompanyImage').val())
                        $.ajax({
                            type: 'post',
                            url: '/regCustomer',
                            data: {
                                custormerName: $('#enterprise-part #custormerName').val(),
                                custormerPhone: $('#enterprise-part #custormerPhone').val(),
                                custormerDriveCard: $('#enterprise-part #custormerDriveCard').val(),
                                custormerIdCard: $('#enterprise-part #custormerIdCard').val(),
                                custormerCompanyId: $('#custormerCompanyId').val(),
                                custormerCompanyCode: $('#custormerCompanyCode').val(),
                                custormerCompanyImage: $('#custormerCompanyImage').val(),
                                custormerCompanyTaxIIdCard: $('#custormerCompanyTaxIIdCard').val(),
                                custormerState: 0,
                                custormerCategory: 1,
                                custormerCreditValue: 0,
                                custormerVipLevel: 0
                            },
                            success: function (data) {
                                layer.alert("客户登记成功", {
                                    icon:6,
                                    btn: ["确认"], yes: function () {
                                        window.location = '/toOrder'
                                    }
                                });

                            }
                        })

                    })
                });
            }
            if ($('#individual').prop("checked")) {
                $('#welcome').css('display', 'none')
                $('#individual-part').css('display', 'block')

            }
        })
        $('input:radio').click(function () {
            var domName = $(this).attr('name');
            var $radio = $(this);
            // if this was previously checked
            if ($radio.data('waschecked') === true) {
                $radio.prop('checked', false);
                $("input:radio[name='" + domName + "']").data('waschecked', false);
                $radio.data('waschecked', false);
            } else {
                $radio.prop('checked', true);
                $("input:radio[name='" + domName + "']").data('waschecked', false);
                $radio.data('waschecked', true);
            }
        });

        $('#individualNextStep').on('click', function () {
            $.ajax({
                type: 'post',
                url: '/regCustomer',
                data: {
                    custormerName: $('#custormerName').val(),
                    custormerPhone: $('#custormerPhone').val(),
                    custormerDriveCard: $('#custormerDriveCard').val(),
                    custormerIdCard: $('#custormerIdCard').val(),
                    custormerState: 0,
                    custormerCategory: 0,
                    custormerCreditValue: 0,
                    custormerVipLevel: 0
                },
                success: function (data) {
                    layer.alert("客户登记成功", {
                        icon:6,
                        btn: ["确认"], yes: function () {
                            window.location = '/toOrder'
                        }
                    });


                }
            })
        })


    });
</script>
</body>
</html>